<template>
    <view class="goods-item" @click="toDetail(data._id)">
        <u--image :src="joinDomain(data.pictures[0].url)" width="100%" height="350rpx"></u--image>
        <view class="info">
            <view class="title two-line-clamp">
                {{data.title}}
            </view>
            <view class="section">
                <view class="price">
                    <text class="unit">￥</text>
                    <text class="number">{{data.price}}</text>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        name: 'GoodsItem',
        props: {
            data: Object
        },
        data() {
            return {
                src: 'https://cdn.uviewui.com/uview/album/1.jpg'
            }
        },
        methods: {
            toDetail(id) {
                this.$nav.to('/pages/goods-detail/goods-detail', {
                    id
                })
            },
        }
    }
</script>

<style lang="scss" scoped>
    .goods-item{
        
        border-radius: $uni-border-radius-lg;
        overflow: hidden;
        background-color: $me-color-card;
        margin-bottom: $me-marging-bottom-card;
        .info{
            padding: $me-padding-card;
            .title{
                color: $uni-color-title;
            }
            .section{
                .unit{
                    font-size: 20rpx;
                }
                .price{
                    color: $me-color-price;
                }
            }
        }
    }
</style>
